<!DOCTYPE HTML>
<html>
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=557087
-->
<head>
  <title>Test for Bug 557087</title>
  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  <script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=557087">Mozilla Bug 557087</a>
<p id="display"></p>
<div id="content">
</div>
<pre id="test">
<script type="application/javascript">

/** Test for Bug 557087 **/

function checkValueMissing(aElement, aExpected)
{
  var msg = aExpected ? aElement.tagName + " should suffer from value missing"
                      : aElement.tagName + " should not suffer from value missing"
  is(aElement.validity.valueMissing, aExpected, msg);
}

function checkCandidateForConstraintValidation(aElement, aExpected)
{
  var msg = aExpected ? aElement.tagName + " should be candidate for constraint validation"
                      : aElement.tagName + " should not be candidate for constraint validation"
  is(aElement.willValidate, aExpected, msg);
}

function checkDisabledPseudoClass(aElement, aDisabled)
{
  var disabledElements = document.querySelectorAll(":disabled");
  var found = false;

  for (var e of disabledElements) {
    if (aElement == e) {
      found = true;
      break;
    }
  }

  var msg = aDisabled ? aElement.tagName + " should have :disabled applying"
                      : aElement.tagName + " should not have :disabled applying";
  ok(aDisabled ? found : !found, msg);
}

function checkEnabledPseudoClass(aElement, aEnabled)
{
  var enabledElements = document.querySelectorAll(":enabled");
  var found = false;

  for (var e of enabledElements) {
    if (aElement == e) {
      found = true;
      break;
    }
  }

  var msg = aEnabled ? aElement.tagName + " should have :enabled applying"
                     : aElement.tagName + " should not have :enabled applying";
  ok(aEnabled ? found : !found, msg);
}

function checkFocus(aElement, aExpected)
{
  aElement.setAttribute('tabindex', 1);

  // We use the focus manager so we can test <label>.
  var fm = SpecialPowers.Cc["@mozilla.org/focus-manager;1"]
                        .getService(SpecialPowers.Ci.nsIFocusManager);
  fm.setFocus(aElement, 0);

  if (aExpected) {
    is(document.activeElement, aElement, "element should be focused");
  } else {
    isnot(document.activeElement, aElement, "element should not be focused");
  }

  aElement.blur();
  aElement.removeAttribute('tabindex');
}

var elements = [ "input", "button", "select", "textarea", "fieldset", "option",
                 "optgroup", "label", "output", "object" ];

var testData = {
/* tag name | affected by disabled | test focus | test pseudo-classes | test willValidate */
  "INPUT":    [ true,  true, true,  true,  true  ],
  "BUTTON":   [ true,  true, true,  false,  false ],
  "SELECT":   [ true,  true, true,  true,  false ],
  "TEXTAREA": [ true,  true, true,  true,  true  ],
  "FIELDSET": [ true,  true, true,  false, false ],
  "OPTION":   [ false, true, true,  false, false ],
  "OPTGROUP": [ false, true, true,  false, false ],
  "OBJECT":   [ false, true, false, false, false ],
  "LABEL":    [ false, true, false, false, false ],
  "OUTPUT":   [ false, true, false, false, false ],
};

/**
 * For not candidate elements without disabled attribute and not submittable,
 * we only have to check that focus and click works even inside a disabled
 * fieldset.
 */
function checkElement(aElement, aDisabled)
{
  var data = testData[aElement.tagName];
  var expected = data[0] ? !aDisabled : true;

  if (data[1]) {
    checkFocus(aElement, expected);
  }

  if (data[2]) {
    checkEnabledPseudoClass(aElement,  data[0] ? !aDisabled : true);
    checkDisabledPseudoClass(aElement, data[0] ? aDisabled : false);
  }

  if (data[3]) {
    checkCandidateForConstraintValidation(aElement, expected);
  }

  if (data[4]) {
    checkValueMissing(aElement, expected);
  }
}

var fieldset1 = document.createElement("fieldset");
var fieldset2 = document.createElement("fieldset");
var legendA = document.createElement("legend");
var legendB = document.createElement("legend");
var content  = document.getElementById('content');
content.appendChild(fieldset1);
fieldset1.appendChild(fieldset2);
fieldset2.disabled = true;

for (var data of elements) {
  var element = document.createElement(data);

  if (data[4]) {
    element.required = true;
  }

  fieldset1.disabled = false;
  fieldset2.appendChild(element);

  checkElement(element, fieldset2.disabled);

  // Make sure changes are correctly managed.
  fieldset2.disabled = false;
  checkElement(element, fieldset2.disabled);
  fieldset2.disabled = true;
  checkElement(element, fieldset2.disabled);

  // Make sure if a fieldset which is not the first fieldset is disabled, the
  // elements inside the second fielset are disabled.
  fieldset2.disabled = false;
  fieldset1.disabled = true;
  checkElement(element, fieldset1.disabled);

  // Make sure the state change of the inner fieldset will not confuse.
  fieldset2.disabled = true;
  fieldset2.disabled = false;
  checkElement(element, fieldset1.disabled);


  /* legend tests */

  // elements in the first legend of a disabled fieldset should not be disabled.
  fieldset2.disabled = true;
  fieldset1.disabled = false;
  legendA.appendChild(element);
  fieldset2.appendChild(legendA);
  checkElement(element, false);

  // elements in the second legend should be disabled
  fieldset2.insertBefore(legendB, legendA);
  checkElement(element, fieldset2.disabled);
  fieldset2.removeChild(legendB);

  // Elements in the first legend of a fieldset disabled by another fieldset
  // should be disabled.
  fieldset1.disabled = true;
  checkElement(element, fieldset1.disabled);

  // Elements inside a fieldset inside the first legend of a disabled fieldset
  // should not be diasbled.
  fieldset2.disabled = false;
  fieldset1.appendChild(legendA);
  legendA.appendChild(fieldset2);
  fieldset2.appendChild(element);
  checkElement(element, false);

  // Elements inside the first legend of a disabled fieldset inside the first
  // legend of a disabled fieldset should not be disabled.
  fieldset2.disabled = false;
  fieldset2.appendChild(legendB);
  legendB.appendChild(element);
  checkElement(element, false);
  fieldset2.removeChild(legendB);
  fieldset1.appendChild(fieldset2);

  element.parentNode.removeChild(element);
}

</script>
</pre>
</body>
</html>
